<template>
  <el-dialog title="预览文章" :visible.sync="dialogVisible" width="800px">
    <div>
      <h2>{{ dialogData.title }}</h2>
      <div class="prevw">
        <span>{{ dialogData.createTime | parseTimeByString }}</span>
        <span>超级管理员</span>
        <span class="el-icon-view">{{ dialogData.visits }}</span>
      </div>
    </div>
    <div class="content" v-html="dialogData.articleBody"></div>
  </el-dialog>
</template>

<script>
import { detail } from "@/api/hmmm/articles.js";
export default {
  data() {
    return {
      dialogVisible: false,
      dialogData: {},
    };
  },
  methods: {
    // 打开弹框 由父组件调用
    openDialog() {
      this.dialogVisible = true;
    },
    // 获取详情
    getDetail(data) {
      this.openDialog();
      detail(data).then((res) => {
        console.log(res);
        this.dialogData = res.data;
      });
    },
  },
};
</script>

<style scoped lang='sass'>
.content
  background-color: #f5f5f5
  padding: 10px
  border-top: 1px dashed #cccccc
.prevw
  margin: 5px 0 15px 0
.prevw span
  margin-right: 8px
</style>
